<template>
  <div>
    <input placeholder="输入关键字搜索" v-model="uname" />
    <PatientInfo :list="search"></PatientInfo>
  </div>
</template>
<script >
import PatientInfo from "./components/PatientInfo.vue";

export default {
  components: {
    PatientInfo,

  },
  data() {
    return {
      uname: "",
      flag:false,
      list: [
        {
          date: "2020-12-12",
          uname: "张三",
          result: "感冒",
          info: "感冒药",
         
        },
        {
          date: "2020-12-11",
          uname: "李四",
          result: "失眠",
          info: "安眠药",
  
        },
        {
          date: "2020-12-16",
          uname: "王五",
          result: "健康",
          info: "多喝热水",
       
        },
      ],
    };
  },

  computed: {
    search() {
      return this.list.filter((item) => {
        return (
          item.date.includes(this.uname) ||
          item.uname.includes(this.uname) ||
          item.result.includes(this.uname) ||
          item.info.includes(this.uname)
        );
      });
    },
  },
};
</script>


<style scoped>
.my-table {
  border-collapse: collapse;
  width: 100%;
}

.my-table td,
.my-table th {
  border: 1px solid #ddd;
  padding: 8px;
  text-align: left;
}

.my-table th {
  background-color: #f2f2f2;
}
.alert {
  border: 1px solid #000;
  text-align: center;
  margin-left: 500px;
}
</style>
